<template>
  <div class="common-table-operations-component">
    <div class="left-actions">
      <div class="action-buttons">
        <a-button type="primary" @click="handleAdd">
          <template #icon><PlusOutlined /></template>{{ $t('menu.add') }}
        </a-button>
        <a-button @click="handleExpandAll">
          <template #icon>
            <component :is="isExpandAll ? 'NodeCollapseOutlined' : 'NodeExpandOutlined'" />
          </template>
          {{ isExpandAll ? $t('menu.collapseAll') : $t('menu.expandAll') }}
        </a-button>
        <a-button @click="handleRefresh">
          <template #icon><ReloadOutlined /></template>{{ $t('common.refresh') }}
        </a-button>
      </div>
    </div>
    <div class="right-actions">
      <a-space>
        <a-button type="primary" @click="$emit('search')">
          <template #icon><SearchOutlined /></template>{{ $t('common.search') }}
        </a-button>
        <a-button @click="$emit('reset')">
          <template #icon><ReloadOutlined /></template>{{ $t('common.reset') }}
        </a-button>
      </a-space>
    </div>
  </div>
</template>

<script lang="ts" setup>
// 组件名称
defineOptions({
  name: 'MenuTableOperations'
})

// Props定义
withDefaults(defineProps<{
  isExpandAll: boolean
}>(), {
  isExpandAll: false
})

// Emits定义
const emit = defineEmits(['search', 'reset', 'add', 'expand-all', 'refresh'])

/**
 * 添加菜单处理
 */
const handleAdd = () => {
  emit('add')
}

/**
 * 展开/折叠所有处理
 */
const handleExpandAll = () => {
  emit('expand-all')
}

/**
 * 刷新处理
 */
const handleRefresh = () => {
  emit('refresh')
}
</script>

<style lang="scss" scoped>
@import '@/assets/styles/views/common.scss';
</style> 